<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./assets/layui/css/layui.css" />
  </head>
  <body>
    <div class="layui-container"></div>

    <script src="./assets/layui/layui.js"></script>
    <script>
      layui.use(["util"], function () {
        var util = layui.util;
        /***
         * 某个时间在当前时间多久前
         * 第一个参数是某个时间值
         *    如果在3分钟以内，返回：刚刚
              如果在30天以内，返回：若干分钟前、若干小时前、若干天前，如：5分钟前
              如果在30天以上，返回：日期字符，如：2017-01-01
         * 第二个参数 是否在超过30天后，只返回日期字符，而不返回时分秒
         */
        console.log(util.timeAgo("2021/05/11", true));
        /***
         * 格式化日期
         * 第一个参数 日期字符串 对象 时间戳
         * 第二个参数 格式化的格式
         */
        console.log(util.toDateString("2021/05/11", "yyyy年MM月dd日"));
        /**
         * 数字前置补零
         * 第一个参数 原始数字
         * 第二个参数 补零后的总长度
         *
         */
        console.log(util.digit(7, 2));
        /***
         * 转义xss字符
         *
         */
        console.log(util.escape("alert('111')"));

        // <button class="layui-btn" lay-active="e1">事件1</button>
        // <button class="layui-btn" lay-active="e2">事件2</button>
        // <button class="layui-btn" lay-active="e3">事件3</button>
        //处理属性 为 lay-active 的所有元素事件 第三个参数默认为click eventType
        util.event("lay-active", {
          e1: function (othis) {
            alert("触发了事件1");
          },
          e2: function (othis) {
            alert("触发了事件2");
          },
          e3: function (othis) {
            alert("触发了事件3");
          },
        });
      });
    </script>
  </body>
</html>
